// removes margins and paddings
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, hr, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;

  font-family: inherit;
  font-style: inherit;
  font-size: inherit;
  font-weight: inherit;

  border: 0;
  border-radius: 0;
}

// box sizing
html {
  box-sizing: border-box;
}

*,
*::before,
*::after {
  box-sizing: inherit;
}


// removes lame bullets
ul {
  list-style: none;
}

// no system-ui font for inputs and buttons
input,
textarea,
select,
button {
  font: inherit; 

  border: 0;

  appearance: none;

  color: inherit; 
  letter-spacing: inherit; 

  &:focus:not(:focus-visible) {
    outline: none;
  }
}

button {
  border-radius: 0; 
  padding: 0.75em 1em;
  background-color: transparent;
}

button * {
  pointer-events: none;
}

// removes whitespace below media elements and sets them to container size
embed,
iframe,
img,
object,
video {
  display: block;
  max-width: 100%;
}

// hides stuff no matter what
[hidden] {
  display: none !important;
}

// outliers
blockquote, q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}
